<template>
  <div class="body">
    <!-- 标题 -->
    <v-head></v-head>
    <!-- 购物车 -->
    <Row class="restand">
    <i-col class="standkepudigndan" span="17">
      <div class="standardt">
        <!-- <span class="shopcaritemfirstquanxuan">全选</span> -->
        <span class="shopcaritemfirstshangpin">商品</span>
        <span class="shopcaritemfirstshuliang">页数</span>
        <span class="shopcaritemfirstdanjia">单价</span>
        <span class="shopcaritemfirstcaozuo">操作</span>
      </div>
      <div class="result">
        <Row v-if="isempty">
          <i-col span="5">
             <img src="../assets/img/shopcar.png" alt="">
          </i-col>
          <i-col span="15">
            <div class="cartext">购物车空空的哦~，去看看心仪的标准吧~</div>
            <div class="cartext1">购买成功后可在右上角点击用户名进入个人中心-><span class="tobuy" @click="getbuy()">已购买标准</span>下载</div>
          </i-col>
        </Row>
        <Row class="orderrow" v-for="(item,index) in this.shopcar" :key="index">
          <i-col span="2">
            <div class="orderimg" alt=""></div>
          </i-col>
          <i-col span="14">
            <span @click="getDetail(item.product_id,item.standardId)" class="itemtitle" ><span v-html="item.standardId"></span>&#12288;&#12288;<span v-html="item.standardName"></span></span>
            <!-- <span @click="getDetail(item.product_id,item.standardId)" class="itemtitle" >{{item.standardId}}&#12288;&#12288;{{item.standardName}}</span> -->
          </i-col>
          <i-col span="2"><span class="itemdetail">{{item.standardPages}}</span></i-col>
          <i-col span="2"><span class="itemdetail">{{parseInt(item.standardPages)*sunit}}</span></i-col>
          <i-col span="2"><span class="itemdelete" @click="deleteshopCar(item.id)">删除</span></i-col>
        </Row>
        <Page :total="dataCount" :page-size="pageSize" show-total @on-change="changepage" v-if="showPage" class-name="changepage" show-elevator />
      </div>
      <div class="jiesuan">
        <span class="zongjia">总价</span>
        <span class="totalprice">￥{{totalPrice}}</span>
        <i-button type="info" class="jiesuanbtn" @click="addOrder">结算</i-button>
      </div>
      <Modal
        v-model="modal1"
        title="请选择结算方式"
        @on-ok="ok"
        @on-cancel="cancel">
        <Tabs active-key="key1">
          <TabPane label="已有积分支付">
            <span class="paytext">使用已有积分支付</span>
          </TabPane>
          <TabPane label="微信支付">
            <div>
              <!-- <img class="payimg" src="../assets/img/wxpay.jpg" alt=""> -->
              <span class="paytext">暂不支持此支付方式</span>
            </div>
          </TabPane>
          <TabPane label="支付宝支付" >
            <!-- <img class="payimg" src="../assets/img/zfbpay.jpg" alt=""> -->
            <span class="paytext">暂不支持此支付方式</span>
          </TabPane>
        </Tabs>
      </Modal>
    </i-col>
    </Row>
    <!-- 底部 -->
    <v-foot></v-foot>
    <Back-top></Back-top>
  </div>
</template>
<script>
import {neturl} from '../assets/js/common'
export default {
  name: 'seniorsearch',
  data () {
    return {
      dataCount: 0,
      pageSize: 15,
      pageNum: 1,
      showPage: false,
      userinfo: '',
      islogin: false,
      islog: true,
      username: '',
      shopcar: [],
      totalPrice: 0,
      stadNum: '',
      stadName: '',
      totalpages: 0,
      sunit: 0.5,
      modal1: false,
      minutes: 15,
      seconds: 0,
      isempty: true
    }
  },
  methods: {
    getDetail (id, Num) {
      let routeData = this.$router.resolve({path: '/standdetail', query: {id: id, keyword: Num}})
      window.open(routeData.href, '_blank')
    },
    logout () {
      this.$cookie.delete('user')
      let routeUrl = this.$router.resolve({
        path: '/'
      })
      window.open(routeUrl.href)
    },
    deleteshopCar (id) {
      // 删除购物车
      let uuupload = { data: id }
      this.$axios.post(neturl + '/by/shopcar/delete?token=' + this.userinfo.token + '&loginMark=' + this.userinfo.loginMark, uuupload
      ).then(res => {
        // console.log(res)
        this.$Message.success('删除成功!')
        location.reload()
      })
    },
    chongzhi () {
      this.minutes = 15
      this.seconds = 0
    },
    getbuy () {
      let routeUrl = this.$router.resolve({
        path: '/purchasedstandard'
      })
      window.open(routeUrl.href, '_blank')
    },
    addOrder () {
      this.modal1 = true
      // 下单
      // let uuupload = { data: '{paidAmount: ' + "'" + this.totalPrice + "'" +
      // ', productTotalPrice: ' + "'" + this.totalPrice + "'" +
      // ', totalAmoun: ' + "'" + this.totalPrice + "'" +
      // ', member_id: ' + "'" + this.userinfo.userId + "'" +
      // ', standardId: ' + "'" + this.stadNum + "'" +
      // ', shipMobile: ' + "'" + this.userinfo.mobile + "'" +
      // ', shipEmail: ' + "'" + this.userinfo.email + "'" +
      // ', iPAddress: ' + "'" + this.userinfo.iPAddress + "'" +
      // ', shipPhone: ' + "'" + this.userinfo.telephone + "'" +
      // ', shipName: ' + "'" + this.userinfo.account + "'" +
      // ', standardName: ' + "'" + this.stadName + "'" +
      // ', standardPages: ' + "'" + this.totalpages + "'" +
      // ', childList: ' + JSON.stringify(this.shopcar) + '}' }
      // this.$axios.post(neturl + '/by/order/addOrder?token=' + this.userinfo.token + '&loginMark=' + this.userinfo.loginMark, uuupload
      // ).then(res => {
      //   console.log(res)
      //   if (res.data.code === 200) {
      //     this.$Message.success('结算成功!', 3, location.reload())
      //   } else {
      //     this.$Message.error(res.data.info)
      //   }
      // })
    },
    ok () {
      // 下单
      let uuupload = { data: '{paidAmount: ' + "'" + this.totalPrice + "'" +
      ', productTotalPrice: ' + "'" + this.totalPrice + "'" +
      ', totalAmoun: ' + "'" + this.totalPrice + "'" +
      ', member_id: ' + "'" + this.userinfo.userId + "'" +
      ', standardId: ' + "'" + this.stadNum + "'" +
      ', shipMobile: ' + "'" + this.userinfo.mobile + "'" +
      ', shipEmail: ' + "'" + this.userinfo.email + "'" +
      ', iPAddress: ' + "'" + this.userinfo.iPAddress + "'" +
      ', shipPhone: ' + "'" + this.userinfo.telephone + "'" +
      ', shipName: ' + "'" + this.userinfo.account + "'" +
      ', standardName: ' + "'" + this.stadName + "'" +
      ', standardPages: ' + "'" + this.totalpages + "'" +
      ', childList: ' + JSON.stringify(this.shopcar) + '}' }
      // console.log(this.totalpages)
      this.$axios.post(neturl + '/by/order/addOrder?token=' + this.userinfo.token + '&loginMark=' + this.userinfo.loginMark, uuupload
      ).then(res => {
        // console.log(res)
        if (res.data.code === 200) {
          // this.$Message.success('结算成功!', 0, location.reload())
          // this.$Message.success({
          //   content: '结算成功!',
          //   duration: 0,
          //   onClose: location.reload()
          // })
          this.$Notice.success({
            title: '结算成功',
            desc: '结算成功，请在个人中心查看',
            duration: 5,
            onClose: function () {
              location.reload()
            }
          })
        } else {
          this.$Message.error(res.data.info)
        }
      })
    },
    cancel () {
    }
  },
  created () {
    // 获取用户ID
    // this.model1 = this.cityList[0].value
    this.userinfo = this.$cookie.get('user')
    this.userinfo = JSON.parse(this.userinfo)
    // console.log(this.userinfo)
    if (this.userinfo === null) {
      this.$router.push('/login')
    }
    // 已登录
    if (this.userinfo != null) {
      this.islogin = true
      this.islog = false
      this.username = this.userinfo.realName
    }
    // 获取购物车商品数量
    // console.log(this.userinfo)
    let uuupload = { data: this.userinfo.userId }
    this.$axios.post(neturl + '/by/shopcar/getbyId?token=' + this.userinfo.token + '&loginMark=' + this.userinfo.loginMark, uuupload
    ).then(res => {
      // console.log(res) isempty
      this.shopcar = res.data.data.result
      if (this.shopcar.length > 0) {
        this.isempty = false
      }
      // 计算总价
      this.shopcar.forEach(item => {
        this.totalPrice += parseInt(item.standardPages) * this.sunit
        this.stadNum += item.standardId + ','
        this.stadName += item.standardName + ','
        this.totalpages += parseInt(item.standardPages)
        // item.productName += item.standardName + ','
      })
    })
    // 获取当前会员折扣
    this.$axios.post(neturl + '/by/shopcar/getcountbyUserId?token=' + this.userinfo.token + '&loginMark=' + this.userinfo.loginMark, uuupload
    ).then(res => {
      // console.log(res)
      this.sunit = res.data.data.result[0].unit
    })
  },
  watch () {
    // second: {
    //   handler(newVal) {
    //     this.num(newVal)
    //   }
    // },
    // minute: {
    //   handler(newVal) {
    //     this.num(newVal)
    //   }
    // }
  },
  computed () {
    // second:function() {
    //   return this.num(this.seconds)
    // },
    // minute:function() {
    //   return this.num(this.minutes)
    // }
  }
}
</script>

<style scoped>
  @import '../assets/css/shopcar.css';
</style>
